<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div id="app">
        <h3 v-for="item in arr">{{item}}</h3>
        <hr>
        <button @click='add'>添加</button>
        <h3 v-for="item,key in obj">{{key}}------{{item}}</h3>
        <hr>
        <button @click='add2'>添加</button>
    </div>
   
    <script src="../js/vue.js"></script>
    <script>
        var vm = new Vue({
            el:'#app',
            data:{
                arr:["刘为","刘为是煞笔","刘为是大傻逼"],
                obj:{
                    key1:"刘为",key2:"刘为是煞笔",key3:"刘为是大傻逼"
                }
            },
            methods: {
                add(){
                    // this.$set(this.arr,this.arr.length,'刘琦是他爸');
                    this.arr[3] = '刘琦是他爸';
                    this.$forceUpdate();
                    this.arr[3] = '刘琦真是他爸'
                    console.log(this.arr)
                },
                add2(){
                    this.$set(this.obj,'key4','刘琦是他爸');
                    console.log(this.obj)
                }
            },
        })
    </script>
</body>
</html>